/*
 * Copyright (c) 2025 Huawei Device Co., Ltd.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 * limitations under the License.
 */

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:hadss_avoid_area/component/folder_options.dart';
import 'package:hadss_avoid_area/component/folder_split_view.dart';

class FoldSplitContainerUI extends StatefulWidget {
  const FoldSplitContainerUI({super.key});

  @override
  State<FoldSplitContainerUI> createState() => _MyAppState();
}

class _MyAppState extends State<FoldSplitContainerUI> {
  ExpandedRegionLayoutOptions expandedRegionLayoutOptions =
      ExpandedRegionLayoutOptions(
          horizontalSplitRatio: PresetSplitRatio.layout_3V2,
          verticalSplitRatio: PresetSplitRatio.layout_1V1,
          isExtraRegionPerpendicular: true,
          extraRegionPosition: ExtraRegionPosition.top);
  HoverModeRegionLayoutOptions foldingRegionLayoutOptions =
      HoverModeRegionLayoutOptions(
          horizontalSplitRatio: PresetSplitRatio.layout_3V2,
          showExtraRegion: false,
          extraRegionPosition: ExtraRegionPosition.top);
  FoldedRegionLayoutOptions foldedRegionLayoutOptions =
      FoldedRegionLayoutOptions(
          verticalSplitRatio: PresetSplitRatio.layout_1V1);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: FoldSplitContainer(
      primary: Container(
        width: double.infinity,
        height: double.infinity,
        color: const Color.fromARGB(100, 255, 0, 0),
        child: Column(
          children: [
            const Text('折叠态配置'),
            Expanded(
                child: Row(
              children: [
                const Text('折叠态垂直高度度比'),
                Expanded(
                    child: Column(
                  children: [
                    RadioListTile<double>(
                      title: const Text('1:1'),
                      groupValue: foldedRegionLayoutOptions.verticalSplitRatio,
                      value: PresetSplitRatio.layout_1V1,
                      onChanged: (double? value) {
                        setState(() {
                          foldedRegionLayoutOptions.verticalSplitRatio = value!;
                        });
                      },
                    ),
                    RadioListTile<double>(
                      title: const Text('2:3'),
                      groupValue: foldedRegionLayoutOptions.verticalSplitRatio,
                      value: PresetSplitRatio.layout_2V3,
                      onChanged: (double? value) {
                        setState(() {
                          foldedRegionLayoutOptions.verticalSplitRatio = value!;
                        });
                      },
                    ),
                    RadioListTile<double>(
                      title: const Text('3:2'),
                      groupValue: foldedRegionLayoutOptions.verticalSplitRatio,
                      value: PresetSplitRatio.layout_3V2,
                      onChanged: (double? value) {
                        setState(() {
                          foldedRegionLayoutOptions.verticalSplitRatio = value!;
                        });
                      },
                    ),
                  ],
                ))
              ],
            ))
          ],
        ),
      ),
      secondary: Container(
        width: double.infinity,
        height: double.infinity,
        color: const Color.fromARGB(100, 0, 255, 0),
        child: SingleChildScrollView(
          child: Column(
            children: [
              const Text('悬停态配置'),
              Row(
                children: [
                  const Text('悬停态水平宽度比'),
                  Expanded(
                      child: Column(
                    children: [
                      RadioListTile<double>(
                        title: const Text('1:1'),
                        groupValue:
                            foldingRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_1V1,
                        onChanged: (double? value) {
                          setState(() {
                            foldingRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('2:3'),
                        groupValue:
                            foldingRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_2V3,
                        onChanged: (double? value) {
                          setState(() {
                            foldingRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('3:2'),
                        groupValue:
                            foldingRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_3V2,
                        onChanged: (double? value) {
                          setState(() {
                            foldingRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                    ],
                  ))
                ],
              ),
              Row(
                children: [
                  const Text("悬停态是否显示扩展区"),
                  Switch(
                      value: foldingRegionLayoutOptions.showExtraRegion,
                      onChanged: (bool value) {
                        setState(() {
                          foldingRegionLayoutOptions.showExtraRegion = value;
                        });
                      })
                ],
              ),
              foldingRegionLayoutOptions.showExtraRegion
                  ? Row(children: [
                      const Text('悬停态扩展区位置'),
                      Expanded(
                          child: Column(
                        children: [
                          RadioListTile<ExtraRegionPosition>(
                              title: const Text('顶部'),
                              groupValue: foldingRegionLayoutOptions
                                  .extraRegionPosition,
                              value: ExtraRegionPosition.top,
                              onChanged: (ExtraRegionPosition? value) {
                                setState(() {
                                  foldingRegionLayoutOptions
                                      .extraRegionPosition = value!;
                                });
                              }),
                          RadioListTile<ExtraRegionPosition>(
                              title: const Text('底部'),
                              groupValue: foldingRegionLayoutOptions
                                  .extraRegionPosition,
                              value: ExtraRegionPosition.bottom,
                              onChanged: (ExtraRegionPosition? value) {
                                setState(() {
                                  foldingRegionLayoutOptions
                                      .extraRegionPosition = value!;
                                });
                              })
                        ],
                      ))
                    ])
                  : Container()
            ],
          ),
        ),
      ),
      extra: Container(
        width: double.infinity,
        height: double.infinity,
        color: const Color.fromARGB(100, 0, 0, 255),
        child: SingleChildScrollView(
          child: Column(
            children: [
              const Text('展开态配置'),
              Row(
                children: [
                  const Text('展开态水平宽度比'),
                  Expanded(
                      child: Column(
                    children: [
                      RadioListTile<double>(
                        title: const Text('1:1'),
                        groupValue:
                            expandedRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_1V1,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('2:3'),
                        groupValue:
                            expandedRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_2V3,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('3:2'),
                        groupValue:
                            expandedRegionLayoutOptions.horizontalSplitRatio,
                        value: PresetSplitRatio.layout_3V2,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.horizontalSplitRatio =
                                value!;
                          });
                        },
                      ),
                    ],
                  ))
                ],
              ),
              Row(
                children: [
                  const Text('展开态垂直高度度比'),
                  Expanded(
                      child: Column(
                    children: [
                      RadioListTile<double>(
                        title: const Text('1:1'),
                        groupValue:
                            expandedRegionLayoutOptions.verticalSplitRatio,
                        value: PresetSplitRatio.layout_1V1,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.verticalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('2:3'),
                        groupValue:
                            expandedRegionLayoutOptions.verticalSplitRatio,
                        value: PresetSplitRatio.layout_2V3,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.verticalSplitRatio =
                                value!;
                          });
                        },
                      ),
                      RadioListTile<double>(
                        title: const Text('3:2'),
                        groupValue:
                            expandedRegionLayoutOptions.verticalSplitRatio,
                        value: PresetSplitRatio.layout_3V2,
                        onChanged: (double? value) {
                          setState(() {
                            expandedRegionLayoutOptions.verticalSplitRatio =
                                value!;
                          });
                        },
                      ),
                    ],
                  ))
                ],
              ),
              Row(
                children: [
                  const Text("展开态扩展区是否上下贯穿"),
                  Switch(
                      value: expandedRegionLayoutOptions
                          .isExtraRegionPerpendicular,
                      onChanged: (bool value) {
                        setState(() {
                          expandedRegionLayoutOptions
                              .isExtraRegionPerpendicular = value;
                        });
                      })
                ],
              ),
              expandedRegionLayoutOptions.isExtraRegionPerpendicular
                  ? Container()
                  : Row(children: [
                      const Text('悬停态扩展区位置'),
                      Expanded(
                          child: Column(
                        children: [
                          RadioListTile<ExtraRegionPosition>(
                              title: const Text('顶部'),
                              groupValue: expandedRegionLayoutOptions
                                  .extraRegionPosition,
                              value: ExtraRegionPosition.top,
                              onChanged: (ExtraRegionPosition? value) {
                                setState(() {
                                  expandedRegionLayoutOptions
                                      .extraRegionPosition = value!;
                                });
                              }),
                          RadioListTile<ExtraRegionPosition>(
                              title: const Text('底部'),
                              groupValue: expandedRegionLayoutOptions
                                  .extraRegionPosition,
                              value: ExtraRegionPosition.bottom,
                              onChanged: (ExtraRegionPosition? value) {
                                setState(() {
                                  expandedRegionLayoutOptions
                                      .extraRegionPosition = value!;
                                });
                              })
                        ],
                      ))
                    ])
            ],
          ),
        ),
      ),
      foldedLayoutOptions: foldedRegionLayoutOptions,
      expandedLayoutOptions: expandedRegionLayoutOptions,
      hoverModeLayoutOptions: foldingRegionLayoutOptions,
      onHoverStatusChange: (status) {
        if (kDebugMode) {
          print("status=$status");
        }
      },
    ));
  }
}
